<header class="data-table-header p+">
    <div class="data-table-header__label">
        <span class="fs-title">{{objectConfig.base.comment}}</span>
        <span class="fs-caption">{{objectConfig.base.name}}</span>
    </div>

    <div class="data-table-header__actions">
    	<button class="btn btn--l btn--black btn--icon" ng-click="filter()" lx-ripple>
            <i class="mdi mdi-magnify"></i>
        </button>
     	<button class="btn btn--l btn--black btn--icon" ng-click="show()" lx-ripple>
            <i class="mdi mdi-plus"></i>
        </button>

        <div class="inline tm">
            <span>每页</span>
            <select ng-change="index(pageNum,perPage)"ng-model="perPage" ng-options="perPage.num as perPage.num for perPage in  perPages ">
            </select>个
            <button ng-class="{'disabled': 1 == pager.currentPage}"class="btn btn--m btn--blue btn--flat" tc-white lx-ripple ng-click="1 != pager.currentPage && index(pager.currentPage-1)"><<</button>
            <span>{{pager.currentPage}}/{{pager.lastPage}}</span>            
            <button ng-class="{disabled: pager.lastPage <= pager.currentPage}"class="btn btn--m btn--blue btn--flat" tc-white lx-ripple ng-click="pager.lastPage != pager.currentPage && index(pager.currentPage+1)">>></button>
        </div>
    </div>
</header>

<table class="data-table" >
    <thead>
        <tr class="">
            <th class="" ng-if="!field.is_hide" ng-repeat="field in objectConfig.fields">
                <span class="inline" ng-click="order(field)">              
                    <span ng-if="field.relate" > {{field.relate.comment}}<br />{{field.relate.name}}</span>
                    <span ng-if="!field.relate" > {{field.comment}}<br />{{field.name}} </span>

                    <span ng-if="field.is_order && orderField == field.name" class="inline" >
                        <button  ng-model="field.name"  class="btn btn--m btn--blue btn--icon " lx-ripple>
                            <i ng-class="{true:'mdi-chevron-down',false:'mdi-chevron-up'}[field.orderValue]"  class=" icon icon-xxs mdi" ></i>
                        </button>
                    </span>
                </span> 

            </th>
            <th>
            	操作<br />opera
            </th>
        </tr>
    </thead>

    <tbody>
        <tr class="" ng-repeat="object in objects" >
            <td ng-if="!field.is_hide" ng-repeat="field in objectConfig.fields">
            	<span ng-hide="field.is_img">
                    {{object[field.name]}}
                </span>
                <span ng-if="field.relate">
                    {{object[field.relate.table+'_'+field.relate.select]}}
                </span>
                <span ng-if="field.type == 'tinyint(1)'">
                    {{object[field.name]==1?"是":"否"}}
                </span>
                
            	<img src="{{object[field.name]}}" ng-if="field.is_img" />
                
            </td>
          	<td>
          		<button class="btn btn--l btn--black btn--icon" ng-click="show(object)" lx-ripple>
                	<i class="mdi mdi-pencil"></i>
            	</button>
            	<button class="btn btn--l btn--black btn--icon" ng-click="destroy(object)" lx-ripple>
                	<i class="mdi mdi-delete"></i>
            	</button>
          	</td>
        </tr>
    </tbody>
</table>

<lx-dialog class="dialog dialog--l" id="filterDialog" auto-close="true">
    <div class="dialog__header">
        <div class="toolbar bgc-teal-A700 pl++">
            <span class="toolbar__label tc-white fs-title">
                高级搜索
            </span>
        </div>
    </div>

    <div class="dialog__content p++">
        <div flex-item  ng-repeat="field in objectConfig.fields">
            
            <!--text-field-->
            <lx-text-field ng-if="field.type == 'input' || field.type == 'varchar'&& field.is_img != '1' &&field.name != 'content' " label="{{field.comment}} / {{field.name}}" >
                <input type="text"  ng-model="object[field.name]">
            </lx-text-field>

            <!--textare-field-->
            <lx-text-field ng-if="(field.type == 'textarea'||field.type == 'text')" label="{{field.comment}} / {{field.name}}" >
                <textarea ng-model="object[field.name]" ></textarea>
            </lx-text-field>


            <!-- content-field -->
            <div ng-if="field.name == 'content' "style="font-size:0.5em;color:gray;margin-top:10px;">
                <p>{{field.comment}} / {{field.name}}</p>
                <div  class="ueditor" config="config" ng-model="object[field.name]" ></div>                  
            </div>
      

            <!--int-field-->
            <lx-text-field ng-if="field.type == 'int' && !field.relate" label="{{field.comment}} / {{field.name}}" disabled="field.name == 'id'" >
                <input type="text"  ng-disabled="field.name == 'id'" ng-model="object[field.name]">
            </lx-text-field>



            <!--datetime-field-->
    
            <lx-date-picker ng-if="field.type == 'timestamp'" model="object[field.name]" label="{{field.comment}} / {{field.name}}" locale="ch" allow-clear="false"></lx-date-picker>
            


            <!--bool-field-->
            <lx-text-field  ng-if="field.type == 'boolean'" class="switch"label="{{field.comment}} / {{field.name}}" >
                <input type="checkbox" id="switch_{{field.name}}" class="switch__input" ng-model="object[field.name]" >
                <label for="switch_{{field.name}}" class="switch__label">{{field.comment}}</label>
            </lx-text-field>

            <!--select-->
            <lx-select ng-if="field.relate" ng-model="object[field.name]" placeholder="{{field.relate.comment}} / {{field.relate.name}}"
                       choices="ajax.list"  filter="ajax.update(field.relate, newValue, oldValue)" loading="{{ ajax.loading }}"
                       min-length="0" allow-clear="true" selection-to-model="ajax.toModel(field.relate, data, callback)"
                       model-to-selection="ajax.toSelection(field.relate, data, callback)">
                <lx-select-selected>
                    {{ $selected[field.relate.select] }}
                </lx-select-selected>

                <lx-select-choices>
                    {{ $choice[field.relate.select] }}
                </lx-select-choices>
            </lx-select>
        </div>
    </div>

    <div class="dialog__actions">
        <button class="btn btn--m btn--black btn--flat" lx-ripple lx-dialog-close>取消</button>
        <button class="btn btn--m btn--blue  btn--flat" lx-dialog-close ng-click="index(pageNum,perPage,object)" lx-ripple>提交</button>
    </div>
</lx-dialog>
<lx-dialog class="dialog dialog--l" id="showDialog" auto-close="true">
    <div class="dialog__header">
        <div class="toolbar bgc-teal-A700 pl++">
            <span class="toolbar__label tc-white fs-title">
                {{object.id?"更新":"添加"}}
            </span>
        </div>
    </div>

    <div class="dialog__content p++">
        <div flex-item  ng-repeat="field in objectConfig.fields">
            
            <!--text-field-->
            <lx-text-field ng-if="field.type == 'input' || field.type == 'varchar'&& field.is_img != '1' " label="{{field.comment}} / {{field.name}}" >
                <input type="text"  ng-model="object[field.name]">
            </lx-text-field>

            <!--textare-field-->
            <lx-text-field ng-if="(field.type == 'textarea'||field.type == 'text')&&field.name != 'content'" label="{{field.comment}} / {{field.name}}" >
                <textarea ng-model="object[field.name]" ></textarea>
            </lx-text-field>


            <!-- content-field -->
            <div ng-if="field.name == 'content' "style="font-size:0.5em;color:gray;margin-top:10px;">
                <p>{{field.comment}} / {{field.name}}</p>
                <div  class="ueditor" config="config" ng-model="object[field.name]" ></div>                  
            </div>
      

            <!--int-field-->
            <lx-text-field ng-if="field.type == 'int' && !field.relate" label="{{field.comment}} / {{field.name}}" disabled="field.name == 'id'" >
                <input type="text"  ng-disabled="field.name == 'id'" ng-model="object[field.name]">
            </lx-text-field>



            <!--datetime-field-->
    
            <lx-date-picker ng-if="field.type == 'timestamp'||field.type == 'date'" model="object[field.name]" label="{{field.comment}} / {{field.name}}" locale="ch" allow-clear="false"></lx-date-picker>
            
            
            <!-- file upload -->
            <lx-text-field  ng-if="field.is_img == '1'" label="{{field.comment}} / {{field.name}}" >
            <div flex-container="row" >
                <input flex-item="11" type="text"  ng-model="object[field.name]" >
                <button style="float:right;" ng-file-select ng-file-change="upload($files,object)" class="btn btn--m btn--blue btn--fab inline" lx-ripple><i class="mdi mdi-cloud-upload "></i></button>                
            </div>

            </lx-text-field>


            <!--bool-field-->
            <lx-text-field  ng-if="field.type == 'boolean'" class="switch"label="{{field.comment}} / {{field.name}}" >
                <input type="checkbox" id="switch_{{field.name}}" class="switch__input" ng-model="object[field.name]" >
                <label for="switch_{{field.name}}" class="switch__label">{{field.comment}}</label>
            </lx-text-field>

            <!--select-->
            <lx-select ng-if="field.relate" ng-model="object[field.name]" placeholder="{{field.relate.comment}} / {{field.relate.name}}"
                       choices="ajax.list"  filter="ajax.update(field.relate, newValue, oldValue)" loading="{{ ajax.loading }}"
                       min-length="0" allow-clear="true" selection-to-model="ajax.toModel(field.relate, data, callback)"
                       model-to-selection="ajax.toSelection(field.relate, data, callback)">
                <lx-select-selected>
                    {{ $selected[field.relate.select] }}
                </lx-select-selected>

                <lx-select-choices>
                    {{ $choice[field.relate.select] }}
                </lx-select-choices>
            </lx-select>
            {{field.null == "NO"?"*":""}}
        </div>
    </div>

    <div class="dialog__actions">
        <button class="btn btn--m btn--black btn--flat" lx-ripple lx-dialog-close>取消</button>
        <button class="btn btn--m btn--blue  btn--flat" ng-click="store(object)" lx-ripple>提交</button>
    </div>
</lx-dialog>